<template>
  <view class="container">
    <view class="content">
      <view class="title">消息页面</view>
      <view class="content-text">
        <text>这里是您的消息中心，暂无新消息。</text>
      </view>
    </view>

    <!-- 底部导航组件 -->
   <custom-nav 
		:navs="navs" 
		:current-nav="currentNav" 
		@nav-change="handleNavChange"
		></custom-nav>
  </view>
</template>

<script>
  import CustomNav from '@/components/nav.vue';
  export default {
    components: {
      CustomNav
    },
    data() {
      return {
        navs: [
          { label: '首页', value: 'home' },
          { label: '社区', value: 'community' },
          { label: '消息', value: 'message' },
          { label: '我的', value: 'me' }
        ],
        currentNav: 'message'
      }
    },
    methods: {
      // 处理底部导航切换事件（从组件接收）
      handleNavChange(navName) {
        this.currentNav = navName;
        // 可在此添加导航切换后的逻辑
        console.log('切换到：', navName);
      }
    }
  }
</script>

<style scoped>
.message-container {
  padding: 20px;
  box-sizing: border-box;
}

.title {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 20px;
  text-align: center;
}

.content {
  font-size: 16px;
  color: #333;
  text-align: center;
}
</style>